<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@page isELIgnored="false" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>（我的岗位）考勤查询</title>
    <link rel="stylesheet" href="../../dist/css/layui.css">
    <script src="../../dist/layui.js"></script>
</head>
<body>

<table id="demo" lay-filter="test"></table>

<script>

    layui.use('table', function(){
        var table = layui.table;

        //第一个实例
        table.render({
            elem: '#demo'
            ,height: 'full-20'
            ,url: '/student/selectAttendanceById?id='+ ${param.id} //数据接口
            ,page: {
                limit: 10,
                limits: [5, 10]
            }
            ,cols : [[ //表头
                {field: 'workingDate', title: '工作日期',align: "center", width:'33%'}
                ,{field: 'attend', title: '状态',align: "center", width:'33%', templet: '#typeTpl'}
                ,{field: 'deptEmployee', title: '本次指导老师',align: "center", width:'33%'}
            ]]
        });
    });
</script>
<script type="text/html" id="typeTpl">
    {{#  if(d.attend == '出勤'){ }}
    <span style="color: mediumseagreen;">{{ d.attend }}</span>
    {{# } else if(d.attend == '缺勤'){ }}
    <span style="color: orangered;">{{ d.attend }}</span>
    {{# } else { }}
    <span style="color: deepskyblue;">{{ d.attend }}</span>
    {{#  } }}
</script>
</body>
</html>